<header data-am-widget="header" class="am-header am-header-default" style="margin-bottom:10px;background:#FFF;border-bottom:1px solid lightgrey">
  <div id="leftDiv" class="am-header-left am-header-nav">
    <a  onclick="javascript:history.back(-1);">
      <i id="leftIcon" style="color:#000" class="am-header-icon"></i>
    </a>
  </div>
  <h1 class="am-header-title"><a href="#title-link" style="color:#000" class="">{$siteInfo['title']}</a></h1>
  <nav data-am-widget="menu" class="am-menu  am-menu-offcanvas1" data-am-menu-offcanvas> 
    <a href="javascript: void(0)" class="am-menu-toggle"><i style="color:#000" class="am-menu-toggle-icon am-icon-bars"></i></a>
    <div class="am-offcanvas" >
      <div class="am-offcanvas-bar">
        <ul class="am-menu-nav am-avg-sm-1">
          {volist name="nav[0]" id="vo"}
          {notempty name="nav[$vo.nav_id]"}
          <li class="am-parent">
            <a href="{$vo['url']}" >{$vo.nav_title|raw}</a>
            <ul class="am-menu-sub am-collapse  am-avg-sm-3 ">
              {volist name="nav[$vo.nav_id]" id="v"}
              <li><a href="{$v.url}" >{$v.nav_title}</a></li>
              {/volist}
            </ul>
          </li>
          {/notempty}
          {empty name="nav[$vo.nav_id]"}
          <li>
            <a href="{$vo['url']}" >{$vo.nav_title|raw}</a>
          </li>
          {/empty}
          {/volist}
        </ul>
      </div>
    </div>
  </nav>  
</header>